<template>
  <div class="home">
    <h3 v-if="isMp">生命中有你，是一种美丽</h3>
    <div class="swipe">
      <KSwiper
        :indicator-dots="true"
        :circular="true"
        :autoplay="false"
        :duration="500"
        :interval="5000"
      >
        <KSwiperItem v-for="(item, index) in background" :key="index">
          <KView :class="'swiper-item ' + item">item</KView>
        </KSwiperItem>
      </KSwiper>
    </div>
    <img alt="Vue logo" width="50px" height="50px" :src="base64_lists.logo" />
    <HelloWorld />
    <a href="/shui.html">当前页跳转</a>
  </div>
</template>

<script>
import base64_lists from '@/components/common.js';
import HelloWorld from '@/components/HelloWorld.vue';

export default {
  name: 'Home',
  components: {
    HelloWorld
  },
  data() {
    return {
      isMp: process.env.isMiniprogram,
      base64_lists,
      background: ['red', 'yellow', 'blue'],
    };
  },
  created() {
    console.log(process.env.isMiniprogram);
  }
};
</script>
<style lang="less">
.home {
  .swipe {
    .swiper-item {
      height: 100%;
    }
    .red {
      background-color: red;
    }
    .yellow {
      background-color: yellow;
    }
    .blue {
      background-color: blue;
    }
  }
}
</style>
